<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>代码生成器</title>
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="stylesheet" href="http://localhost:8080/libs/element-ui/theme-chalk/index.css">
    <link rel="stylesheet" href="http://localhost:8080/css/index.css">
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>

<div id="app">

    <div class="alert_wrap">
        <el-alert
                title="代码生成器"
                type="success"
                description="可在线生成entity、xml、dao、service、vue、html、js、sql代码，减少70%以上的开发任务，让你更专注业务开发。"
                show-icon
                :closable="false">
        </el-alert>
    </div>

    <el-card shadow="always">

            <el-form ref="searchForm" :inline="true" :model="searchForm" size="medium">

                <div class="tools_wrap">
                    <div class="search">
                        <el-form-item prop="database">
                            <el-select v-model="searchForm.database" @change="changeDatabase" placeholder="数据库" >
                                <el-option
                                        v-for="item in databases"
                                        :key="item.SCHEMA_NAME"
                                        :label="item.SCHEMA_NAME"
                                        :value="item.SCHEMA_NAME"
                                >
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item prop="tableName">
                            <el-input placeholder="数据库表" v-model="searchForm.tableName" clearable size="medium"></el-input>
                        </el-form-item>

                        <el-button type="primary" icon="el-icon-search" @click="handleSearch" size="medium">搜索</el-button>
                        <el-button type="primary" icon="el-icon-refresh-left" @click="handleResetSearch('searchForm')" size="medium">重置</el-button>
                    </div>
                    <div class="generator">
                        <el-form-item>
                            <el-input v-model="form.packageName" placeholder="自定义包名：com.quan" clearable size="medium"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-input v-model="form.moduleName" placeholder="自定义模块名：system" clearable size="medium"></el-input>
                        </el-form-item>
                        <el-button type="primary" icon="el-icon-finished" @click="handleGeneratorCode" size="medium">生成代码</el-button>
                    </div>
                </div>

            </el-form>

        <el-table
                :data="tableDataList"
                v-loading="loading"
                fit stripe border highlight-current-row
                @selection-change="handleSelection"
                style="width: 100%">
            <el-table-column type="selection" width="55" align="center"></el-table-column>
            <el-table-column type="index" width="55" align="center"></el-table-column>

            <el-table-column prop="tableName" label="表名"></el-table-column>
            <el-table-column prop="ENGINE" label="数据库引擎"></el-table-column>
            <el-table-column prop="tableComment" label="表备注"></el-table-column>
            <el-table-column prop="createTime" label="时间"></el-table-column>
        </el-table>


        <!-- 分页工具栏 -->
        <div class="pagination">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="searchForm.page"
                    :page-sizes="[10, 20, 30, 50]"
                    :page-size="searchForm.limit"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total">
            </el-pagination>
        </div>
    </el-card>
</div>

<script src="http://localhost:8080/libs/vue.js"></script>
<script src="http://localhost:8080/libs/element-ui/index.js"></script>
<script src="http://localhost:8080/libs/axios.min.js"></script>
<script src="http://localhost:8080/js/index.js"></script>
</body>
</html>